//获取应用实例
const app = getApp()


Page({

  /**
   * 页面的初始数据
   */
  data: {
    cate: [],
    welfareList: [],
    leftDomsTop: [],
    rightDomsTop: [],
    rightScollTop: 0,
    selectItems: [],
  },

  onLoad: function (option) {

    app.$loadingUtil.showLoading('加载中');

    let that = this;
    app.$http.getWelfare().then(res => {

      app.$loadingUtil.hideLoading();

      for (const val in res) {
        let welfareDetailList = [];
        res[val].forEach(item => {
          welfareDetailList.push({
            id: item.id,
            name: item.name,
            select: false
          })
        })
        that.data.welfareList.push({
          name: val,
          welfareDetail: welfareDetailList
        });
      }
      const cate = that.data.welfareList.map((item, index) => {
        return {
          name: item.name,
          state: index == 0 ? true : false,
          pid: index
        }
      })


      //接受上个页面的数据，并选择
      const selectWelfareList = JSON.parse(option.welfareList);
      if (selectWelfareList) {
        that.data.selectItems = selectWelfareList;
        that.data.welfareList.forEach(item => {
          item.welfareDetail.forEach(res => {
            for (let i = 0; i < selectWelfareList.length; i++) {
              if (res.id == selectWelfareList[i]) {
                res.select = true;
                break;
              }
            }
          });
        })
      }


      that.setData({
        cate: cate,
        welfareList: that.data.welfareList,
      })


      //必须在页面加载完成后才能获取节点信息
      that.queryElInfo(".left-scroll-item", (res) => {
        that.data.leftDomsTop = res[0].map(item => {
          return item.top;
        });
      });

      that.queryElInfo(".right-scroll-item", (res) => {
        that.data.rightDomsTop = res[0].map(item => {
          return item.top;
        });
      });
    });
  },


  queryElInfo(data, callback) {
    const query = wx.createSelectorQuery();
    query.selectAll(data).boundingClientRect().exec(res => {
      callback(res);
    });
  },

  changeCate(e) {
    const index = e.currentTarget.dataset.index;
    this.data.cate.forEach(item => {
      item.state = false;
    })
    this.data.cate[index].state = true;
    this.setData({
      cate: this.data.cate,
      rightScollTop: this.data.rightDomsTop[index]
    })
  },


  bindScroll(e) {
    const scrollTop = e.detail.scrollTop;
    const list = this.data.rightDomsTop;
    for (let i = 0; i < list.length; i++) {
      if (scrollTop + 10 < list[i] && i - 1 >= 0) {
        if (!this.data.cate[i - 1].state) {
          this.data.cate.forEach(item => {
            item.state = false;
          })
          this.data.cate[i - 1].state = true;
          this.setData({
            cate: this.data.cate
          });
        }
        break;
      }
    }
  },


  changeId(e) {
    const index = e.currentTarget.dataset.index;
    const typeIndex = e.currentTarget.dataset.type;
    const item = this.data.welfareList[typeIndex].welfareDetail[index];
    if (!item.select) {
      if (this.data.selectItems.length >= 10) {
        wx.showToast({
          title: '最多十项',
        })
        return;
      }
      this.data.selectItems.push(item.id);
    } else {
      const index = this.data.selectItems.indexOf(item.id);
      if ((index != -1)) {
        this.data.selectItems.splice(index, 1);
      }
    }
    item.select = !item.select;
    this.setData({
      welfareList: this.data.welfareList,
    });
  },

  config() {
    app.$routes.back(app.$routes.home)
  },


  resetConfig(){
    this.data.selectItems = [];
    this.data.welfareList.forEach(item=>{
      item.welfareDetail.forEach(res=>{
        res.select = false;
      });
    })
    this.setData({
      welfareList:this.data.welfareList
    })
  },

  onUnload(){
    const channel = this.getOpenerEventChannel();
    channel.emit("welfarePage", {
      data: this.data.selectItems
    })
  }
})